import React from "react";
import { connect } from 'react-redux'

import Counter from "./Counter";

const mapStateToProps = state=>{
  return {
    value: state.value,
    message: state.message
  }//return 的对象内容,则追加到props属性内
};

const mapDispatchToProps = dispatch=>{
  return {
    add(){
      dispatch({type: 'ADD'})
    },
    sub(){
      dispatch({type: 'SUB'})
    },
    say(){
      dispatch({type: 'SAY'})
    }
  }
};

// connect函数是 高阶组件,返回函数,再调用传入组件,返回高阶组件
// CounterContainer为容器组件,包含业务逻辑
// Counter为UI组件,只负责渲染页面
const CounterContainer = connect(
  mapStateToProps,
  mapDispatchToProps
)(Counter);

export default CounterContainer
